<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>客户资源管理系统登录...</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="images/favicon.ico">
<link rel="stylesheet" type="text/css" href="easyui/themes/bootstrap/easyui.css" />
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/css/common.css" />
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
	var logindlg;
	var loginForm;
	var regDlg;
	var regForm;
	$(function() {
		logindlg = $('#logindlg').dialog({
			modal : true,
			closable : false,
			iconCls : 'icon-tip',
			buttons : [ {
				text : '注册',
				iconCls : 'icon-edit',
				handler : function() {
					$('#regDlg').dialog('open');
				}
			}, {
				text : '登录',
				iconCls : 'icon-help',
				handler : function() {
					loginForm.submit();
				}
			} ]
		});

		//form 提交
		loginForm = $('#loginForm').form({
			url : 'loginAction/login.do?',
			onSubmit : function() {
				return $(this).form('enableValidation').form('validate');
			},
			success : function(r) {
				//r = eval("(" + r + ")");
				r = $.parseJSON(r);//将标准json转成obj
				if (r && r.success) {
					logindlg.dialog('close');
					location.href = "index.jsp";
				} else {
					$.messager.alert('提示', '用户名密码错误');
					$("input[name='username']").val('');
					$("input[name='userpwd']").val('');
				}
			}
		});
		//回车换行和提交
		loginForm.find('input').on('keyup', function(event) {
			if (event.keyCode == '13') {
				loginForm.submit();
			}
		});
		//注册对话框
		regDlg = $('#regDlg').dialog({
			title : '用户注册',
			closed : true,
			cache : false,
			iconCls : 'icon-tip',
			modal : true,
			buttons : [ {
				text : '注册',
				handler : function() {
					$('#regForm').submit();
				}
			}, {
				text : '关闭',
				handler : function() {
					$('#regDlg').dialog('close');
				}
			} ]
		});
		regForm = $('#regForm').form({
			url : 'userAction/reg.do',
			onSubmit : function() {
				if ($('#pwd1').val() == $('#pwd2').val()) {
					return true;
				} else {
					$.messager.alert('提示', '两次密码输入不一致');
					$("input[name='pwd']").val('');
					$("input[name='repwd']").val('');
					return false;
				}
			},
			success : function(r) {
				r = $.parseJSON(r);//将标准json转成obj
				if (r && r.success) {
					$('#regDlg').dialog('close');
					$.messager.show({
						title : '提示',
						msg : '注册成功',
						showType : 'show'
					});
				}
			}
		});
	});
</script>
</head>
<body>
<div style="text-align: center" ><h1 style="font-size: 50px;">客户资源管理系统 by SLD</h1></div>
	
	<div id="logindlg" title="用户登录" style="width: 300px; height: 220px; padding: 22px">
		<form id="loginForm" action="" method="post">
			<table>
				<tr>
					<th>用户名</th>
					<td><input class="easyui-validatebox" name="username" type="text" value="${username}"
						data-options="novalidate:true,missingMessage:'请输入用户名'" /></td>
				</tr>
				<tr>
					<th>密码</th>
					<td><input class="easyui-validatebox" name="userpwd" type="password" value=""
						data-options="novalidate:true,missingMessage:'请输入密码'" /></td>
				</tr>
				<tr>
					<th>用户类型</th>
					<td><select class="easyui-combobox" name="usertype" style="width: 155%" panelHeight="42px">
							<option value="admin">管理员</option>
							<option value="user">普通用户</option>
					</select></td>
				</tr>
			</table>
		</form>
	</div>
	<div id="regDlg" style="width: 330px; height: 270px; padding: 22px">
		<form id="regForm" method="post">
			<table cellpadding="5">
				<tr>
					<th>用户名</th>
					<td><input class="easyui-validatebox" type="text" name="name"
						data-options="novalidate:true,missingMessage:'请输入用户名'"></input></td>
				</tr>
				<tr>
					<th>密码</th>
					<td><input id="pwd1" class="easyui-validatebox" name="pwd" type="password"
						data-options="novalidate:true,missingMessage:'请输入密码'" /></td>
				</tr>
				<tr>
					<th>确认密码</th>
					<td><input id="pwd2" class="easyui-validatebox" name="repwd" type="password"
						data-options="novalidate:true,missingMessage:'重复输入密码'" /></td>
				</tr>
				<tr>
					<th>用户类型</th>
					<td><select class="easyui-combobox" name="type" style="width: 100%" panelHeight="42px">
							<option value="admin">管理员</option>
							<option value="user">普通用户</option>
					</select></td>
				</tr>
			</table>
		</form>
	</div>
	<script type="text/javascript">
	<!--
		//ajax 提交
		//console.info('dianjidenglu');
		/*
		 if ($('#loginForm').form('validate')) {
		 $.ajax({
		 url : 'login.do?',
		 data : $('#loginForm').serialize(),//序列化表格为字符串 username=a?password=b
		 /*复杂写法
		 data : {
		 username : $('#loginForm input[name=username]').val(),
		 password : $('#loginForm input[name=password]').val()
		 },*/
		/*
		 cache : false,
		 dataType : 'json',
		 success : function() {
		 console.info('aok');
		
		 if (r && r.success) {
		 logindlg.dialog('close');
		 $.messager.show({
		 title : '提示',
		 msg : '登录成功',
		 showType : 'show'
		 });
		 } else {
		 $.messager.alert('提示', '用户名密码错误');
		 }
		 },
		 error : function() {
		 $.messager.alert('提示', '用户名密码错误');
		 }
		 });
		 }*/
	//-->
	</script>
</body>
</html>